<template>
  <a-modal
    :title='title'
    :width='width'
    :visible='visible'
    :maskClosable='false'
    :confirmLoading='confirmLoading'
    @ok='handleOk'
    @cancel='handleCancel'
    cancelText='关闭'>

    <template slot='footer'>
      <a-button key='back' @click='handleCancel'>关闭</a-button>
    </template>

    <a-spin :spinning='confirmLoading'>
      <a-form :form='form'>
        <template v-if="barcode==='Android'">
          <img :src='androidCode' style='width: 300px;margin: 0 auto;display: block'>
          <div class='tip'>不支持微信</div>
        </template>
        <template v-else>
          <img :src='iOSqrcode' style='width: 300px;margin: 0 auto;display: block'>
          <div class='tip'>请打开手机扫一扫扫码安装。</div>
        </template>
      </a-form>
    </a-spin>
  </a-modal>
</template>

<script>

import { putAction } from '@/api/manage'

export default {
  name: 'qrcodeModal',
  data() {
    return {
      title: '二维码',
      width: document.body.clientWidth * 0.3,
      visible: false,
      confirmLoading: false,
      form: this.$form.createForm(this),
      url: {
        getIOSQRcode: '/apk/sysApk/getIOSQRcode',
        imgerver: window._CONFIG['domianURL'] + '/sys/common/view'
      },
      barcode: '',
      iOSqrcode: '',
      androidCode: ''       //每次进去请求一次地址（为了刷新地址拿到图片）
    }
  },
  methods: {
    edit(barcode) {
      this.barcode = barcode
      if (this.barcode === 'iOS') {
        this.confirmLoading = true
        putAction(this.url.getIOSQRcode, {}).then((res) => {
          if (res.success) {
            if (res.result) {
              this.getAvatarView(res.result)
            }
          } else {
            this.$message.warning(res.message)
          }
          this.confirmLoading = false
        })
      } else {
        this.getAndroidAvatarView()
      }
      this.visible = true
    },
    //用于回显图片（公用）
    getAvatarView(file) {
      this.iOSqrcode = this.url.imgerver + '/' + file
    },
    //更换安卓二维码图片
    getAndroidAvatarView() {
      this.androidCode = window._CONFIG['domianURL'] + '/apk/sysApk/generateQrCode'
      // console.log(this.androidCode)
    },
    handleCancel() {
      this.close()
    },
    close() {
      this.$emit('close')
      this.visible = false
      this.barcode = ''
      this.iOSqrcode = ''
      this.androidCode = ''
    },
    handleOk() {
    }
  }
}
</script>

<style scoped>
.tip {
  width: 100%;
  text-align: center;
  padding: 10px;
  color: #f5222d;
  font-size: 16px;
  font-weight: bold;
}

.tip:before {
  display: inline-block;
  margin-right: 3px;
  color: #f5222d;
  font-size: 14px;
  font-family: SimSun, sans-serif;
  content: "*";
}
</style>

